<template>
    <div>
        <div>
            <el-breadcrumb separator-class="el-icon-arrow-right" style="height: 30px;">
                <el-breadcrumb-item>HR系统</el-breadcrumb-item>
                <el-breadcrumb-item>信息管理</el-breadcrumb-item>
                <el-breadcrumb-item>休息管理</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <!-- 班别搜索模块 -->
        <div>
            <el-form label-width="100px" style="flex: 1;">
                <div style="display: flex;">
                    <el-row>
                        <el-col style="width: 100px;">
                            <el-form-item label="餐别代码:"></el-form-item>
                        </el-col>
                        <el-col style="width: 200px;">
                            <el-input placeholder="请输入餐组代码：" v-model="XiuXiInfo.XiuXiCode"></el-input>
                        </el-col>
                        <el-col style="width: 100px;">
                            <el-form-item label="餐组名称："></el-form-item>
                        </el-col>
                        <el-col style="width: 200px;">
                            <el-input placeholder="请输入餐组名称：" v-model="XiuXiInfo.XiuXiName"></el-input>
                        </el-col>
                        <el-col style="width: 100px;">
                            <el-form>
                                <el-form-item>
                                    <el-button type="primary" @click="getXiuXiData()" size="mini"
                                        style="height: 40px;"><i class="el-icon-search" />搜索</el-button>
                                </el-form-item>
                            </el-form>
                        </el-col>
                        <el-col style="width: 100px;">
                            <el-button type="danger" @click="reset()" size="mini" style="height: 40px;">重置 <i
                                    class="el-icon-refresh-left" /></el-button>
                        </el-col>
                    </el-row>
                </div>
            </el-form>
        </div>
    </div>


</template>

<script>
export default {
    created() {
        this.getXiuXiData();
    },
    data() {
        return {
            // 餐组的参数信息
            XiuXiInfo: {
                XiuXiCode: "",//餐组代码
                XiuXiName: "",//餐组名称
                pageNumber: 1,//默认显示的页数
                pageSize: 5,//每页默认显示的数据
            }
        }
    }
}
</script>

<style>
.content-search {
    background: #ffffff;
    height: 10px;
}

.el-table__body-wrapper {
    overflow-y: auto;
}

.button-container {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.row-container {
    display: flex;
    justify-content: flex-end;
    margin-top: 30px;
}
</style>